import ListItem from "./components/ListItem/ListItem";
import "./assets/list.css";
// console.log("listitem:", ListItem);
const App = () => {
  const data = [
    {
      id: "01",
      date: new Date(2023, 7, 20),
      title: "学习React",
      desc: "今天学习了130分钟",
    },
    {
      id: "02",
      date: new Date(2022, 4, 5),
      title: "学习Typescript",
      desc: "今天学习了40分钟",
    },
    {
      id: "03",
      date: new Date(2023, 11, 13),
      title: "学习微前端",
      desc: "今天学习了60分钟",
    },
  ];
  const ListItems = data.map((item) => (
    <ListItem
      key={item.id}
      date={item.date}
      title={item.title}
      desc={item.desc}
    ></ListItem>
  ));
  return (
    <div className="list">
      {/* 传递属性title desc fn。组件中通过参数props接收 */}
      {ListItems}
    </div>
  );
};

export default App;
